<!--
 * @Descripttion: 订单管理
 * @version:
 * @Author: 赵致喜
 * @Date: 2020-10-12 18:48:41
 * @LastEditors: 穆宏宇
 * @LastEditTime: 2020-11-26 19:07:10
-->
<template>
	<div class="organization">
		<el-form label-position="'right'" label-width="120px" label-suffix=":">
			<el-col :span="6">
				<el-form-item label="下单时间">
					<el-date-picker type="daterange" v-model="searchFormData.createTime" style="width: 100%;" />
				</el-form-item>
			</el-col>
			<el-col :span="6">
				<el-form-item label="订单编号">
					<el-input type="text" v-model="searchFormData.orderNo" />
				</el-form-item>
			</el-col>
			<el-col :span="6">
				<el-form-item label="订单名称">
					<el-input type="text" v-model="searchFormData.orderName" />
				</el-form-item>
			</el-col>
			<el-col :span="6">
				<el-form-item label="电商订单号">
					<el-input type="text" v-model="searchFormData.eshopNumber" />
				</el-form-item>
			</el-col>
			<el-col :span="6">
				<el-form-item label="商品名称">
					<el-input type="text" v-model="searchFormData.goodsName" />
				</el-form-item>
			</el-col>
			<el-col :span="6">
				<el-form-item label="sku">
					<el-input type="text" v-model="searchFormData.sku" />
				</el-form-item>
			</el-col>
			<el-col :span="6">
				<el-form-item label="状态">
					<el-select v-model="searchFormData.status">
						<!-- <el-option label="可对账" value="A1001"></el-option> -->
						<el-option label="可开票" value="A1002"></el-option>
						<el-option label="申请开票" value="A1003"></el-option>
						<el-option label="已开票" value="A1004"></el-option>
					</el-select>
				</el-form-item>
			</el-col>
			<el-col :span="6">
				<!-- <el-button @click="sendHandle" style="float: right;margin-left: 10px;">可对账</el-button> -->
				<el-button @click="refreshControlHandle" style="float: right;margin-left: 10px;margin-bottom: 10px;">重置</el-button>
				<el-button @click="searchControlHandle" style="float: right;">查询</el-button>
			</el-col>
		</el-form>
		<div class="table-box">
			<el-table :data="tableData" border :span-method="objectSpanMethod" @selection-change="handleSelectionChange"
				height="calc(100vh - 270px)">
				<el-table-column type="selection" width="50" fixed="left"></el-table-column>
				<el-table-column label="序号" width="50" fixed="left">
					<template slot-scope="scope">
						{{scope.$index+1}}
					</template>
				</el-table-column>
				<el-table-column prop="orderNo" label="订单号" fixed="left" width="200">
				</el-table-column>
				<el-table-column prop="eshopNumber" label="电商订单号" fixed="left" width="200">
				</el-table-column>
				<el-table-column label="发票信息" width="150">
					<template slot-scope="scope">
						<el-button @click="getPaper(scope.row)">开票信息</el-button>
					</template>
				</el-table-column>
				<el-table-column prop="orderName" label="订单名称" width="200">
				</el-table-column>
				<!-- <el-table-column prop="name" label="姓名">
				</el-table-column>
				<el-table-column prop="account" label="账号">
				</el-table-column> -->
				<el-table-column prop="sjorgname" label="上级采购组织" width="200">
				</el-table-column>
				<el-table-column prop="orgname" label="采购组织" width="200">
				</el-table-column>
				<!-- <el-table-column prop="depositBank" label="开户行">
				</el-table-column>
				<el-table-column prop="accountNumber" label="银行卡号">
				</el-table-column> -->
				<el-table-column prop="goodsName" label="商品名称" width="200">
					<template slot-scope="scope">
						{{scope.row.newquotaObj.goodsName}}
					</template>
				</el-table-column>
				<el-table-column prop="sku" label="sku">
					<template slot-scope="scope">
						{{scope.row.newquotaObj.sku}}
					</template>
				</el-table-column>
				<el-table-column prop="supplierTaxRate" label="税率">
					<template slot-scope="scope">
						{{scope.row.newquotaObj.supplierTaxRate}}
					</template>
				</el-table-column>
				<el-table-column prop="price" label="含税单价">
					<template slot-scope="scope">
						{{scope.row.newquotaObj.price}}
					</template>
				</el-table-column>
				<el-table-column prop="excludeTaxPrice" label="未税单价">
					<template slot-scope="scope">
						{{scope.row.newquotaObj.excludeTaxPrice}}
					</template>
				</el-table-column>
				<el-table-column prop="buyNum" label="数量">
					<template slot-scope="scope">
						{{scope.row.newquotaObj.buyNum}}
					</template>
				</el-table-column>
				<el-table-column prop="budget" label="含税总价">
					<template slot-scope="scope">
						{{scope.row.newquotaObj.budget}}
					</template>
				</el-table-column>
				<el-table-column prop="allExcludeTaxPrice" label="未税总价">
					<!-- ???? -->
					<template slot-scope="scope">
						{{scope.row.newquotaObj.allExcludeTaxPrice}}
					</template>
				</el-table-column>
				
				<el-table-column prop="specification" label="规格">
					<template slot-scope="scope">
						{{scope.row.newquotaObj.specification}}
					</template>
				</el-table-column>
				<el-table-column prop="typeNo" label="型号">
					<template slot-scope="scope">
						{{scope.row.newquotaObj.typeNo}}
					</template>
				</el-table-column>
				<el-table-column prop="supplierName" label="备注">
					<template slot-scope="scope">
						{{scope.row.newquotaObj.supplierName1}}
					</template>
				</el-table-column>
				<el-table-column prop="supplierName" label="供应商">
					<template slot-scope="scope">
						{{scope.row.newquotaObj.supplierName}}
					</template>
				</el-table-column>
			</el-table>

			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
				:page-size="pageData.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="pageData.total"
				style="text-align: right;">
			</el-pagination>

		</div>



		<el-dialog title="批量对账" :visible.sync="remarkDialogShow" width="500px">
			<el-input type="textarea" placeholder="请输入备注" v-model="remark" maxlength="1000" show-word-limit></el-input>
			<div slot="footer" class="dialog-footer">
				<el-button @click="remarkDialogShow = false">取 消</el-button>
				<el-button type="primary" @click="submitHandle(remark)">确 定</el-button>
			</div>
		</el-dialog>
		
		<el-dialog title="开票信息信息" :visible.sync="paperDialogShow" width="500px">
			<el-form label-position="'right'" label-width="120px" label-suffix=":">
				<el-form-item label="发票类型">
					<el-input v-if="paperDict.receiptType == 0" value="增值税普通发票" readonly="readonly" />
					<el-input v-if="paperDict.receiptType == 1" value="增值税专用发票" readonly="readonly" />
				</el-form-item>
				<el-form-item label="税号">
					<el-input v-model="paperDict.dutyParagraph" readonly="readonly" />
				</el-form-item>
				<el-form-item label="单位名称">
					<el-input v-model="paperDict.unitName" readonly="readonly" />
				</el-form-item>
				<el-form-item label="发票打印电话">
					<el-input v-model="paperDict.registrationTelephone" readonly="readonly" />
				</el-form-item>
				<el-form-item label="开户银行">
					<el-input v-model="paperDict.depositBank" readonly="readonly" />
				</el-form-item>
				<el-form-item label="银行账号">
					<el-input v-model="paperDict.accountNumber" readonly="readonly" />
				</el-form-item>
				<el-form-item label="发票打印地址">
					<el-input v-model="paperDict.registeredAddress" readonly="readonly" />
				</el-form-item>
			</el-form>
			<!-- <div slot="footer" class="dialog-footer">
				<el-button @click="paperDialogShow = false">取 消</el-button>
				<el-button type="primary" @click="submitHandle2()">确 定</el-button>
			</div> -->
		</el-dialog>
	</div>
</template>

<script>
	import {
		findTOrderPurchaserList,
		setReceivingStatus,
		getTreceipt
	} from '@/api/admin.api'
	import moment from 'moment'
	export default {
		name: 'supplierReconciliation',
		data() {
			return {
				searchFormData: {
					createTime:['',''],
					status: "A1002",
				},
				tableData: [],
				// 分页数据
				pageData: {
					// 当前分页
					pageNum: 1,
					// 分页条数
					pageSize: 10,
					// 数据总数
					total: 0,
				},
				// 表格选中数据
				tableSelectData: [],
				remarkDialogShow: false,
				paperDialogShow:false,
				remark: "",
				paperDict:{}
			}
		},
		methods: {
			getPaper(row){
				var that = this;
				console.log(row);
				getTreceipt({
					id:row.mid
				}).then((res2) => {
					console.log(res2);
					that.paperDict = res2;
					that.paperDialogShow = true;
				})
			},
			submitHandle(remark) {
				var that = this;
				var arr = this.multipleSelection;
				if(arr.length<=0){
					return this.$message({
						type: 'error',
						message: '请选择操作行!'
					});
				}
				var list = [];
				for (var i = 0; i < arr.length; i++) {
					list.push({
						id: arr[i].newquotaObj.id,
						isReceipt: 1,
						remark: remark,
						status: "A1001"
					})
				}
				setReceivingStatus(list).then((res) => {
					console.log(res);
					this.$message({
						type: 'success',
						message: '对账成功!'
					});
					this.getTableData();
					this.remarkDialogShow = false;
				})
			},
			// 检索订单管理列表
			searchControlHandle() {
				this.getTableData()
			},
			handleSizeChange(val) {
				this.pageData.pageSize = val
				this.getTableData()
			},
			handleCurrentChange(val) {
				this.pageData.pageNum = val
				this.getTableData()
			},
			handleSelectionChange(val) {
				this.multipleSelection = val;
				console.log(val)
			},
			sendHandle() {
				console.log(this.multipleSelection);
				this.remarkDialogShow = true;
			},
			objectSpanMethod({
				row,
				column,
				rowIndex,
				columnIndex
			}) {
				let addIndex = 0;
				if (columnIndex > 1 && columnIndex < 8) {
					if (rowIndex == row.numAll) {
						return {
							rowspan: row.lengthNum,
							colspan: 1,
						};
					} else {
						return {
							rowspan: 0,
							colspan: 0,
						};
					}
				} else {
					return {
						rowspan: 1,
						colspan: 1,
					};
				}
			},
			// 重置搜索条件
			refreshControlHandle() {
				this.searchFormData = {
					createTime:['',''],
					status:"A1002"
				}
				this.getTableData()
			},
			// 请求订单管理列表
			getTableData() {
				const newSearch = {
					orderNo: this.searchFormData.orderNo,
					orderName: this.searchFormData.orderName,
					createTime1: this.searchFormData.createTime[0] ? moment(this.searchFormData.createTime[0]).format('YYYY-MM-DD') : '',
					createTime2: this.searchFormData.createTime[1] ? moment(this.searchFormData.createTime[1]).format('YYYY-MM-DD') : '',
					orgname: this.searchFormData.orgname,
					status: this.searchFormData.status,
					...this.pageData,
					name:this.searchFormData.name,
					eshopNumber:this.searchFormData.eshopNumber,
					goodsName:this.searchFormData.goodsName,
					sku:this.searchFormData.sku
				}
				console.log(newSearch);
				findTOrderPurchaserList(newSearch).then((res) => {
					let tableData = res.rows;
					let newArr = [];
					let numAll = 0;
					for (let i = 0; i < tableData.length; i++) {
						for (let j = 0; j < tableData[i].tOrderDetailV.length; j++) {
							newArr.push({
								...tableData[i],
								newquotaObj: tableData[i].tOrderDetailV[j],
								lengthNum: tableData[i].tOrderDetailV.length,
								numAll,
							});
						}
						numAll = numAll + tableData[i].tOrderDetailV.length;
					}
					console.log(newArr);
					this.tableData = newArr;
					this.pageData.total = res.total;
				})

			},
		},
		created() {},
		mounted() {
			this.getTableData();
		},
	}
</script>

<style>
	.el-button--text {
		display: none;
	}
</style>
